NPM 패키지 배포 및 설치
개요
- 디자인 시스템을 구축하는 과정에서 NPM으로 패키지를 배포하고 설치하는 방법에 대해서 알아봄
- 단, NPM은 공개(public)의 경우 무료이지만 비공개(private)의 경우 유료 플랜이므로 이에 대체재로 500MB까지 무료인 github packages를 적용하였음
적용
패키지 생성
- 모듈 제작
- package.json 생성
// package.json
{
"name": "@muziksworld/test-mds",
"version": "0.0.1",
"main": "dist/cjs/index.js",
"module": "dist/esm/index.js",
"files": [
"dist/**/*",
"README.md"
],
"repository": {
"type": "git",
"url": "https://github.com/MuziksWorld/Test-MDS"
},
"publishConfig": {
"registry": "https://npm.pkg.github.com"
},
"license": "MIT",
}
- name은 "@깃헙아이디(또는 조직명)/패키지명"으로 작성하되, 대소문자를 구분해야함. yarn install을 통해 패키지 설치 시 대소문자를 확인하므로 이러한 구분이 없을 경우 오류가 발생하게 됨
- version은 패키지 업데이트 시 버전 업이 필요함
- main은 모듈을 실행할 수 있는 파일
- repository는 나의 패키지가 publish 되었을 때 해당 repo에서 배포된 패키지를 확인할 수 있음
- publishConfig은 어떤 곳에 publish 할 것인지에 대한 정보
- github 토큰 생성
- write:packages 체크 : 패키지를 publish 하므로 적용 필요
- npm 로그인
npm login --scope=@OWNER --registry=https://npm.pkg.github.com
- username : github username
- password : github token
- 배포
npm publish
패키지 설치
- .npmrc 파일 생성
//npm.pkg.github.com/:_authToken=<github token>
@<user name or organization name>:registry=https://npm.pkg.github.com/
- 패키지 설치
yarn add <package name@version>